<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <f:view contentType="text/html">
        <h:head>
            <f:facet name="first">
                <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                <title>.::AsPerA::. Asignación de Permisos de Aprendices</title>
                <link rel="shortcut icon" href="favicon.ico"/>
            </f:facet>
        </h:head>
        <h:body>
            <div>
                <h:graphicImage url="/aspera/images/aspera.jpg" width="100%" height="100%" alt="LogoAspera"  style="vertical-align: top;"/> 
            </div>

            <p:panel>
                <p:panelGrid> 
                    <p:row>
                        <p:column style="vertical-align: top;">
                            <h:form>
                                <p:menu>
                                    <p:submenu label="Menú">                                
                                        <p:menuitem value="Inicio" url="/faces/aspera/indexCoordinador.xhtml" />
                                        <p:menuitem value="Coordinadores" url="/faces/aspera/GestionCoordinador.xhtml" />
                                        <p:menuitem value="Permisos" url="/faces/aspera/ApruebaPermisosCoord.xhtml" />
                                        <p:menuitem value="Instructores" url="/faces/aspera/gestionInstructores.xhtml" />
                                        <p:menuitem value="Asignar Fichas" url="/faces/aspera/asignarFichas.xhtml" />
                                        <p:menuitem value="Programas" url="/faces/aspera/gestionProgramas.xhtml" />
                                        <p:menuitem value="Fichas" url="/faces/aspera/gestionFichas.xhtml" />     
                                        <p:menuitem value="Aprendices" url="/faces/aspera/gestionAprendices.xhtml" />
                                        <p:menuitem value="Reportes" url="/faces/aspera/Reportes.xhtml" />
                                        <p:menuitem value="Cambio Contraseña" url="/faces/aspera/CambiaPasswordCoord.xhtml" />
                                        <p:menuitem value="Cerrar Sesión" actionListener="#{usuariosVista.cerrarSesion_action}" />
                                    </p:submenu>                   
                                </p:menu>
                            </h:form>
                        </p:column>
                        <p:column>

                            <h:form id="formulario"> 
                                <p:panel id="panelProgramas" header="Programas de Formación">
                                    <p:focus context="panelProgramas"/>
                                    <p:messages id="mensajes" showDetail="true" /> 
                                    <f:facet name="actions">
                                        <p:commandLink onclick="PF('helpDialog').show();" styleClass="ui-panel-titlebar-icon ui-corner-all ui-state-default"><h:outputText styleClass="ui-icon ui-icon-help" /></p:commandLink>
                                    </f:facet>
                                    <p:panelGrid  columns="2">
                                        <h:outputText value="Código:"/>
                                        <p:inputText id="txtCodigo" binding="#{programaVista.txtCodigo}" size="30">
                                            <p:ajax listener="#{programaVista.txtCodigo_listener}" update="panelProgramas" />
                                            <p:tooltip for="txtCodigo" value="Digite El Código del Programa y Presione TAB" showEffect="slide" hideEffect="slide" />
                                        </p:inputText>                                    

                                        <h:outputText value="Nombre:"/>
                                        <p:inputText id="txtNombre" binding="#{programaVista.txtNombre}" size="30"/>

                                        <f:facet name="footer"> 
                                            <div align="center">
                                                <p:commandButton id="btnCrear" value="Crear" binding="#{programaVista.btnRegistrar}" action="#{programaVista.registrar_action}" update="formulario" />
                                                <p:commandButton id="btnModificar" value="Modificar" binding="#{programaVista.btnModificar}" action="#{programaVista.modificar_action}" disabled="true" update="formulario"/>
                                                <p:commandButton id="btnEliminar" value="Eliminar" binding="#{programaVista.btnEliminar}"  onclick="PF('confirmation').show()" disabled="true" type="button" />
                                                <p:commandButton id="btnLimpiar" value="Limpiar" binding="#{programaVista.btnLimpiar}" action="#{programaVista.limpiar_action}" update="formulario" />
                                            </div>
                                        </f:facet>
                                    </p:panelGrid>

                                    <p:dataTable id="listaProgramas" var="programas" value="#{programaVista.listaProgramas}" selection="#{programaVista.selectedPrograma}"
                                                 selectionMode="single" rowKey="#{programas.codigo}" paginator="true" rows="5" emptyMessage="No existe el Programa!" 
                                                 filteredValue="#{programaVista.listaProgramas}">
                                        <p:ajax event="rowSelect" listener="#{programaVista.onRowSelect}"   
                                                update=":formulario:panelProgramas" /> 
                                        <p:column sortBy="#{programas.codigo}" filterBy="#{programas.codigo}" filterMatchMode="contains">
                                            <f:facet name="header">
                                                <h:outputText  value="Código" />                            
                                            </f:facet>
                                            <h:outputText  value="#{programas.codigo}" />                          
                                        </p:column>

                                        <p:column sortBy="#{programas.nombre}" filterBy="#{programas.nombre}">
                                            <f:facet name="header" >
                                                <h:outputText  value="Nombre" />                            
                                            </f:facet>
                                            <h:outputText  value="#{programas.nombre}" />                          
                                        </p:column>
                                    </p:dataTable>                    

                                    <!--Panel Exportar -->
                                    <p:panel header="Exportar">   
                                        <h:commandLink>
                                            <!--PDF-->
                                            <h:outputText value="PDF" />
                                            <p:dataExporter type="pdf" fileName="ListadoProgramas" target="listaProgramas"/>
                                        </h:commandLink>

                                        <h:outputText value=" | " />

                                        <h:commandLink>
                                            <!--EXCEL-->
                                            <h:outputText value="XLS" />
                                            <p:dataExporter type="xls" fileName="ListadoProgramas" target="listaProgramas"/>
                                        </h:commandLink>
                                    </p:panel>
                                </p:panel>
                                <!-- dialogo de ayuda -->
                                <p:dialog id="modalDialog" header="Ayuda" widgetVar="helpDialog" showEffect="fade" hideEffect="bounce" modal="true" dynamic="true">  
                                    <p align="justify">                       
                                        En esta página usted podrá:<br/><br/>
                                        <b>-Crear, Modificar, Eliminar y Consultar Programas:</b> ésta opción solo está disponible para usuarios de tipo Coordinador. 
                                        Para crear un programa basta con digitar su código y luego presionar la tecla TAB(Tabulación) o Enter. ASPERA verificará que no haya un 
                                        programa con ese mismo código. Si existe cargará sus datos y sino usted deberá continuar llenando el formulario. Luego de clic 
                                        en el botón Crear. Para modificar o eliminar un programa existente seleccionelo de la tabla inferior.
                                        <br/><br/>
                                        <b>-Consultar y Filtrar Programas:</b> en la tabla de resultados se pueden visualizar todos los programas existentes. 
                                        Si desea filtrar los resultados basta con digitar en la columna Código un número especifico, de igual forma se puede utilizar 
                                        el filtro por Nombre.<br/>                    
                                    </p>
                                </p:dialog>
                            </h:form>
                            <!-- Dialogo de confirmacion para el boton eliminar -->
                            <h:form id="formDialog" > 
                                <p:confirmDialog id="confirmDialog" message="Está Seguro de Eliminar el Programa?"  
                                                 header="Confirmación" severity="alert" widgetVar="confirmation">  
                                    <p:commandButton id="confirm" value="Si" oncomplete="PF('confirmation').hide()" update=":formulario:panelProgramas"  
                                                     actionListener="#{programaVista.onEliminacionConfirm}" />  
                                    <p:commandButton id="decline" value="No" onclick="PF('confirmation').hide()" type="button" />   

                                </p:confirmDialog> 
                            </h:form>
                        </p:column>
                    </p:row>
                </p:panelGrid>
            </p:panel> 
            <div>
                <h:graphicImage url="/aspera/images/asperaPie.jpg" width="100%" height="100%" alt="LogoAspera"  style="vertical-align: bottom;"/>
            </div>
        </h:body>

    </f:view>
</html>
